import { createRouter, createWebHistory } from "vue-router";
import notFound from "../views/404.vue";
import login from "../views/login.vue";
import home from "../views/home.vue";
import layout from "@/components/layout/layout.vue";
import appMenu from "@/components/layout/appMenu.vue";
import test1 from "../views/system/test1.vue";
import test2 from "../views/system/test2.vue";
import test3 from "../views/system/test3.vue";
import dashboard from "@/views/dashboard.vue";
import { RouterView } from "vue-router";
import { shallowRef } from 'vue'

export var routerMapp = [
  {
    path: "/",
    name: "dashboard",
    redirect: "/login",
  },
  {
    path: "/login",
    name: "login",
    component: login,
  },
  {
    path: "/:pathMatch(.*)*",
    name: "notFound",
    component: shallowRef(notFound),
  },
  {
    path: "/home",
    name: "home",
    component: shallowRef(layout),
    // 注意:二级路由没有/
    children: [
      {
        path: "/",
        name: "dashboard",
        component: shallowRef(dashboard),
      },
      {
        path: "/okc",
        name: "system",
        component: RouterView,
        children: [
          {
            path: "role",
            name: "test1",
            component: test1,
          },
          {
            path: "test2",
            name: "test2",
            component: test2,
          },
          {
            path: "test3",
            name: "test3",
            component: test3,
          },
        ],
      },
    ],
  },
];
const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: routerMapp,
});

export default router;
